<template>
	<scroll-view @scrolltolower="lower" class="scroll-restaurants-list " scroll-y="true" style="height:100%">
		<swiper class=" padding-top-xs padding-bottom-xs margin-top-sm bg-white c-radius" style="height: 380rpx;" indicator-dots="true" indicator-color="rgba(228,228,228,1)"
		 indicator-active-color="#FECA49">
			<block v-for="(item, index) in categoryList" :key="index">
				<swiper-item class="margin-top-sm">
					<block v-for="(item, index2) in item" :key="index2">
						<view class="category-info">
							<view @tap="_urlJump(item)">
								<image :src="item.hktIcon" class="category-image " @error="_loadDefaultImg(item)"></image>
								<view class="category-text">{{item.hktName}}</view>
							</view>
						</view>
					</block>
				</swiper-item>
			</block>
		</swiper>
	</scroll-view>
</template>

<script>
import conf from '@/conf/config.js';
	export default {
	  // 组件传参菜单数据
    props: ['categoryList'],
		data() {
			return {
			}
		},
		mounted() {
		},
		methods: {
			_urlJump: function(_menu){
				console.log(_menu)
				if(_menu.skipType == 2){
					// 站外
					let url = encodeURIComponent(_menu.url)
					this.vc.navigateTo({
						url:'/pages/hcWebView/hcWebView?url='+url
					})
					return;
				} else if(_menu.skipType == 1){
					// 站内
					this.vc.navigateTo({
						url: _menu.url
					},true)
					return;
				}else if(_menu.skipType == '3'){
					let _url = "/pages/goods/goodsList?hktId="+_menu.hktId
					this.vc.navigateTo({
						url: _url
					},true)
				}else if(_menu.skipType == 'S'){
					this.vc.navigateTo({
						url: _menu.url
					},true)
				}else{
					return;
				}
			},
			toPage: function(pageUrl) {
				console.log('pageUrl',pageUrl)
				if(pageUrl.indexOf('/pages/shopIndex/category')> -1){
					uni.switchTab({
						url:pageUrl
					})
					return ;
				}
				
				this.vc.navigateTo({
					url:pageUrl
				},false)
			},
			callUndefined:function(){
				uni.showToast({
					icon:'none',
					title:'此功能暂不开放'
				})
			},
			_loadDefaultImg:function(item){
				item.hktIcon = "/static/menu.png"
			}
		}
	}
</script>

<style>
	.categoryList {
		width: 100%;
		height: 360upx;
		border-bottom: 20rpx solid #f4f4f4;
	}

	.category-image {
		width: 80rpx;
		height: 80rpx;
		border-radius: 10upx;
		/* background-image: url('/static/images/user/class-02.png');
		background-size: cover; */
	}

	.category-text {
		font-size: 25rpx;
		width: 100%;
	}

	.category-info {
		display: inline-block;
		text-align: center;
		position: relative;
		height: 150rpx;
		width: 25%;
	}
</style>
